<template>
	<view style="background-color: #EEFCEB;" class='zong'>
		<!-- <navigationBarVue :bgImgType="0" navigationTitle="入驻店铺" /> -->
		<uni-nav-bar title="我要入驻" leftIcon="back" backgroundColor="#EEFCEB" color="black" @clickLeft="bk"></uni-nav-bar>
		<view class="shangjiaxinxi_kuang">
			<view class="xiang">
				<text class='biaoti'>商户名称</text>
				<input type="text" placeholder="请输入商户名称" v-model="xinxi.shopname" />
			</view>
			<view class="xiang">
				<text class='biaoti'>手机号码</text>
				<input type="number" placeholder="请输入联系人手机号码" v-model="xinxi.mobile" />
			</view>
			<view class="xiang">
				<text class='biaoti'>店铺地址</text>
				<input type="text" placeholder="请输入店铺地址" v-model="xinxi.address" @click='xuandianpudizhi' />
			</view>
			<view class="xiang">
				<text class='biaoti'>联系人姓名</text>
				<input type="text" placeholder="请输入联系人姓名" v-model="xinxi.name" />
			</view>
		</view>
		<view class="yingyezhizhao_kuang">
			<view class="yingyezhizhao">
				<text class='biaoti'>营业执照照片</text>
				<!-- <view class='tu'>
					<uploadColumnVue :item="pnumber" v-model="xinxi.image" />
				</view> -->
				<view class="imgssss">
					<image
						:src="!xinxi.image ? baseurl+'/applet/common/xiangji.png': `https://lichu.ascetic.top${xinxi.image}`"
						mode="aspectFill" @tap="chuantu('image')"></image>
				</view>

			</view>
			<view class="tongyi">
				<text class='biaoti'>统一社会信用代码</text>
				<input type="text" placeholder="请输入营业执照统一社会信用代码" v-model="xinxi.number" />
			</view>
		</view>
		<view class="shipin_kuang">
			<view class="shipin">
				<text class='biaoti'>食品经营许可证</text>
				<view class="imgssss">
					<image
						:src="!xinxi.qualification_image ? baseurl+'/applet/common/xiangji.png': `https://lichu.ascetic.top${xinxi.qualification_image}`"
						mode="aspectFill" @tap="chuantu('qualification_image')"></image>
				</view>
			</view>
		</view>
		<view class="jiankang_kuang">
			<view class="jiankang">
				<text class='biaoti'>负责人健康证</text>
				<view class="imgssss">
					<image
						:src="!xinxi.health ? baseurl+'/applet/common/xiangji.png': `https://lichu.ascetic.top${xinxi.health}`"
						mode="aspectFill" @tap="chuantu('health')"></image>
				</view>
			</view>
		</view>
		<view class="dianming_kuang">
			<view class="dianming">
				<text class='biaoti'>店面照片</text>
				<view class="imgssss">
					<image
						:src="!xinxi.logo ? baseurl+'/applet/common/xiangji.png': `https://lichu.ascetic.top${xinxi.logo}`"
						mode="aspectFill" @tap="chuantu('logo')"></image>
				</view>
			</view>
		</view>
		<!-- 		<view style="display: flex;justify-content: flex-start;align-items: center;padding: 25rpx;">
			<radio @click="dyxz" />
			<text style="margin: 0 15rpx;">确认同意</text>
			<text style="color: red;">《商家入住协议》</text>
		</view> -->
		<view class="" style="height: 150rpx;">
		</view>
		<view @click="tj" class="foottj" style="display: flex;justify-content: center;align-items: center;">
			<text style="color: white;font-size: 35rpx;">提交申请</text>
		</view>
	</view>
</template>

<script>
	let that, header = {
			token: '25e41bfd-5990-47f6-9996-9e44e78f6abd'
		},
		method = 'post'
	// import { ShapeGizmosSchema } from 'XrFrame/components/gizmo/ShapeGizmos';
	import {
		log
	} from '../../../api';
	import navigationBarVue from '../components/navigationBar/navigationBar.vue';
	import uploadColumnVue from '@/components/uploadColumnVue.vue';
	export default {
		components: {
			navigationBarVue,
			uploadColumnVue
		},
		data() {
			return {
				baseurl: getApp().globalData.baseurl,
				xz: false,
				shi_ma: {},
				qu_ma: {},
				pnumber: {
					tp: 1,
				},
				topHeight: 0, //顶部高度
				xinxi: {
					shopname: '',
					mobile: '',
					address: '',
					name: '',
					image: '',
					number: '',
					qualification_image: '',
					health: '',
					logo: '',
					city: '',
					pcode: '',
					code: '',
					lat: '',
					lng: ''
				},
				dataInfo: {
					name: '', //姓名
					xb: '', //性别
					sjh: '', //手机号
					sjmc: '', //商家名称
					yyzz: '', //营业执照
					rlsb: '', //人脸识别
					zfzzm: '', //身份证正面
					zfzfm: '', //身份证反面
				}
			}
		},
		computed: {
			list() {
				return []
			}
		},

		onLoad(options) {
			that = this
			uni.request({
				url: 'https://www.lichu2025.cn/api/chef/user/info',
				method,
				header,
				success: (res) => {
					if (res.data.status == '2') {
						uni.showModal({
							title: '温馨提示',
							content: '审核中',
							showCancel: false,
							confirmColor: '#F00000',
							success: (res) => {
								if (res.confirm) {
									uni.switchTab({
										url: '/pages/index/index'
									});
								}
							}
						});
					} else if (res.data.status == '4') {
						uni.showModal({
							title: '审核失败',
							content: '原因：来了',
							showCancel: false,
							confirmColor: '#F00000',
							success: (res) => {
								if (res.confirm) {
									uni.switchTab({
										url: '/pages/index/index'
									});
								}
							}
						});
					}
				},
				fail: (err) => {
					console.error('请求失败：', err);
				}
			});
			that.huoqudizhishuju();
		},
		methods: {
			huoqudizhishuju() {
				if (Object.keys(that.shi_ma).length === 0 || Object.keys(that.qu_ma).length === 0) {
					uni.request({
						url: 'https://www.lichu2025.cn/api/increased/index/GetAreaList',
						method,
						header,
						success(res) {
							if (res.res.code === 1) {
								let shi_ma = {},
									qu_ma = {}
								for (let item of res.data) {
									if (item.children) {
										for (let child of item.children) {
											shi_ma[child.name] = child.zip
											for (let c1 of child.children) {
												qu_ma[c1.name] = c1.zip
											}
										}
									}
								}
								that.shi_ma = shi_ma
								that.qu_ma = qu_ma
							}
						}
					})
				}
			},
			xuandianpudizhi() {
				// 91110108772551611J
				if (that.xinxi.address === '') {
					uni.chooseLocation({
						success(res) {
							that.xinxi.lat = res.latitude
							that.xinxi.lng = res.longitude
							that.xinxi.address = res.address
						}
					});
				}
			},
			chuantu(leixing) {
				uni.chooseImage({
					count: 1,
					success(res) {
						let filePath = res.tempFilePaths[0]
						uni.uploadFile({
							url: 'https://www.lichu2025.cn/api/common/upload',
							header,
							filePath,
							name: 'file',
							success(res) {
								res = JSON.parse(res.data)
								if (res.code === 1) {
									that.xinxi[leixing] = res.data.url
								}
							}
						})
					}
				})
			},
			dyxz() {
				this.xz = true
				console.log(this.xz)
			},
			tj() {
				Object.keys(that.xinxi).forEach(k => {
					if (['lat', 'lng'].indexOf(k) > -1) {
						that.xinxi[k] = String(that.xinxi[k])
					}
					if (typeof(that.xinxi[k]) == 'string') that.xinxi[k] = that.xinxi[k].trim()
				});
				let xinxi = that.xinxi
				if (xinxi.shopname == '') {
					uni.showToast({
						title: '请填写商户名称',
						icon: 'error'
					})
				} else if (xinxi.mobile == '') {
					uni.showToast({
						title: '请填写手机号码',
						icon: 'error'
					})
				} else if (!/^1[3-9]\d{9}$/.test(xinxi.mobile)) {
					uni.showToast({
						title: '请检查手机号码',
						icon: 'error'
					})
				} else if (xinxi.address == '') {
					uni.showToast({
						title: '请填写店铺地址',
						icon: 'error'
					})
				} else if (xinxi.name == '') {
					uni.showToast({
						title: '请填写联系人',
						icon: 'error'
					})
				} else if (xinxi.image == '') {
					uni.showToast({
						title: '请上传营业执照',
						icon: 'error'
					})
				} else if (xinxi.number == '') {
					uni.showToast({
						title: '请填写信用代码',
						icon: 'error'
					})
				} else if (xinxi.qualification_image == '') {
					uni.showToast({
						title: '请上传经营许可',
						icon: 'error'
					})
				} else if (xinxi.health == '') {
					uni.showToast({
						title: '请上传健康证',
						icon: 'error'
					})
				} else if (xinxi.logo == '') {
					uni.showToast({
						title: '请上传店名照片',
						icon: 'error'
					})
				} else if (xinxi.lat == '' || xinxi.lng == '') {
					uni.showToast({
						title: '请选择定位',
						icon: 'error'
					})
				} else {
					const addressArray = xinxi.address.match(/^(.*?省|.*?自治区|.*?特别行政区)?(.*?市)?(.*?区|.*?县)?(.*)/);
					const sheng = addressArray[1] || ''; // 省
					const shi = addressArray[2] || ''; // 市
					const qu = addressArray[3] || ''; // 区
					xinxi.city = `${sheng}/${shi}/${qu}`
					xinxi.pcode = that.shi_ma[shi]
					xinxi.code = that.qu_ma[qu]
					uni.request({
						url: 'https://www.lichu2025.cn/api/increased/index/ApplyShop',
						header,
						method,
						data: xinxi,
						success(res) {
							if (res.res.code == 1) {
								uni.showToast({
									title: '申请已提交'
								})
							}
						},
						complete(res) {
							setTimeout(() => {
								uni.switchTab({
									url:'/pages/user'
								})
							}, 2000)
							console.log(res, 'com');
						}
					})
				}
			},
			bk() {
				uni.switchTab({
					url: '/pages/index/index'
				});
			}
		},

	}
</script>

<style lang="scss" scoped>
	.wrap-item {
		padding: 0;
	}

	.shangjiaxinxi_kuang,
	.yingyezhizhao_kuang,
	.shipin_kuang,
	.jiankang_kuang,
	.dianming_kuang {
		width: 690rpx;
		background: white;
		border-radius: 20rpx;
		font-size: 30rpx;
		margin-left: 30rpx;
		padding: 0 30rpx 0 30rpx;
		position: relative;
		margin-top: 30rpx;

		.biaoti,
		input {
			position: absolute;
			font-size: 30rpx;
			font-weight: 400;
		}

		.biaoti {
			top: 40rpx;

			&::before {
				content: '*';
				color: red;
			}
		}
	}

	.imgssss {
		width: 171rpx;
		height: 171rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #FAFAFA;
		position: absolute;
		top: 108rpx;

		image {
			width: 100rpx;
			height: 100rpx;
		}
	}

	.shangjiaxinxi_kuang {
		margin-top: 20rpx;
		height: 773rpx;

		.xiang {
			width: 627rpx;
			height: 193rpx;
			position: relative;
			border-bottom: 1px solid #DBDBDB;

			&:last-child {
				border: none;
			}

			input {
				width: 629rpx;
				top: 120rpx;
			}
		}
	}

	.yingyezhizhao_kuang {
		height: 513rpx;

		.yingyezhizhao,
		.tongyi {
			width: 629rpx;
			position: relative;
		}

		.yingyezhizhao {
			height: 312rpx;
			border-bottom: 1px solid #DBDBDB;



			.tu,
			image {
				// position: absolute;
				// width: 171rpx;
				// height: 171rpx;
			}

			.tu {
				top: 38rpx;
			}
		}

		.tongyi {
			height: 200rpx;

			input {
				width: 629rpx;
				top: 120rpx;
			}
		}

	}

	.shipin_kuang,
	.jiankang_kuang,
	.dianming_kuang {
		height: 322rpx;
	}

	.shipin_kuang>.shipin,
	.jiankang_kuang>.jiankang,
	.dianming_kuang>.dianming {
		width: 630rpx;
		position: relative;
		height: 322rpx;

		image {
			// position: absolute;
			// top: 108rpx;
			// width: 171rpx;
			// height: 171rpx;
			// overflow: hidden;
		}
	}

	.box-scanner {
		padding: 25rpx 25rpx 0rpx 25rpx;

		.box {
			background-color: white;
			border-radius: 15rpx;
			width: 100%;
			display: flex;
			justify-content: space-between;
			align-items: center;

			.text {
				display: flex;
				flex-direction: column;

				.text1 {
					font-size: 32rpx;
					color: #333333;
				}

				.text2 {
					font-size: 28rpx;
					color: #C0BFC0;
					margin-top: 20rpx;
				}
			}
		}
	}

	.foottj {
		border-radius: 16rpx;
		position: fixed;
		left: 0rpx;
		bottom: 10rpx;
		width: 100%;
		z-index: 99;
		width: 675rpx;
		height: 90rpx;
		margin-left: 38rpx;
		background-color: #84BD00;
	}
</style>